<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>Document</title>
	<script type="text/javascript" src="jquery-3.3.1.js"></script>
    <style type="text/css">
        *
        {
        	margin: 0;padding: 0;
        }
        li
        {
        	list-style: none;width: 200px;height: 200px;background: pink;margin-left: 20px;float: left;
        	text-align: center;line-height: 200px;
        }
    </style>

</head>
<body>
	
	<ul class="ul">
		<li>第一个li</li>
		<li>第二个li</li>
		<li>第三个li</li>
		<li>第四个li</li>
		<li>第五个li</li>
	</ul>
</body>
</html>
<script type="text/javascript">
	$(function(){
		//需要做的是给每个li加上不同的透明度，从0.2-1
		
		//for循环
		// for(var i=0;i<$('.ul>li').length;i++)
		// {

		// 	$('.ul>li').eq(i).css('opacity',(i+2)/10);
		
		// }
		

		//each遍历
		$('.ul>li').each(function(index,element){   //传两参数
			//index:下标
			//element:元素  <li>第一个li</li>  dom对象
			//$(element):把dom对象转换为jq对象
			$(element).css('opacity',(index+2)/10);

		});
	});

</script>